<nc-component v-bind:data="data[index]" class="component-title" v-bind:style="{ backgroundColor : nc.backgroundColor }">

	<!-- 预览 -->
	<template slot="preview">
		
		<h2 v-show="nc.title" v-bind:style="{ textAlign :nc.textAlign, fontSize : nc.fontSize + 'px' }">{{ nc.title }}</h2>
		<p  v-show="nc.subTitle" v-bind:style="{ textAlign :nc.textAlign, fontSize : nc.fontSize-4 + 'px' }">{{ nc.subTitle }}</p>
		
	</template>

	<!-- 编辑 -->
	<template slot="edit">
		<div @click.stop="">
			<div class="layui-form-item">
				<label class="layui-form-label sm">文本名</label>
				<div class="layui-input-block">
					<input type="text" v-model="nc.title" v-bind:id="'title_'+index" placeholder="请输入文本" class="layui-input">
				</div>
			</div>
				
			<div class="layui-form-item">
				<label class="layui-form-label sm">副文本</label>
				<div class="layui-input-block">
					<input type="text" v-model="nc.subTitle" v-bind:id="'subTitle_'+index" placeholder="请输入副文本" class="layui-input">
				</div>
			</div>
			
			<font-size v-bind:data="{ value : nc.fontSize }"></font-size>
			
	<!-- 		<text-align></text-align> -->
			
			<color v-bind:data="{ field : 'backgroundColor', 'label' : '背景颜色' }"></color>
			
			<nc-link v-bind:data="{ field : nc.link }"></nc-link>
			
			<template v-if="nc.lazyLoad">
				<text-empty></text-empty>
			</template>
		</div>
	</template>
	
	<!-- 资源 -->
	<template slot="resource">

		<css src="{$resource_path}/text/css/design.css"></css>
		<js src="{$resource_path}/text/js/design.js"></js>
		
	</template>
	
</nc-component>